<template>
    <div class="containers" style="margin-top: 45px;">
        <van-nav-bar
		title="购物车列表"
		left-arrow
		@click-left="onClickLeft"
		/>
        <van-card
        :num="item.goodnum"
        :price="item.goodprice"
        :desc="item.gooddesc"
        :title="item.goodname"
        :thumb="item.picurl || imageURL"
        v-for="item in datas"
        v-show="item.goodstatus == 0"
        :key="item.id"
        >
        <div slot="footer">
            <van-button size="mini" @click="remove(item)">移除</van-button>
        </div>
        </van-card>
      <van-submit-bar
        :price="vantAllPrice"
        button-text="提交订单"
        @submit="onSubmit"
        >
        </van-submit-bar>
    </div>
</template>
<script>
import {mapState} from 'vuex'
import {Toast} from 'vant'
import {updateMemorialCs} from '../api/getData.js'
export default {
  data () {
    return {
      show: false,
      allprice: 0,
      chosenAddressId: '',
      imageURL: require('../assets/bei.jpg'),
      mid: '',
      datas: []
    }
  },
  created () {
      this.mid = JSON.parse(window.localStorage.getItem('item')).id
      this.data = this.$route.query.data
      this.getCarList()
  },
  methods: {
      onClickLeft () {
          this.$router.go(-1)
      },
      onSubmit () {
          var that = this
        //   this.$router.push('/music-list')
        updateMemorialCs(that.mudiBg, that.mudiMusic, that.dragItemLists).then(res => {
                                Toast('保存成功！')
                            })
        this.$axios.get("/huainianwang/shoppingCart/app/VRpay?mid="+this.mid+"")
                    .then(function(res){
                      updateMemorialCs(that.mudiBg, that.mudiMusic, that.dragItemLists).then(res => {
                                Toast('保存成功！')
                            })
                    that.$axios.get("/huainianwang/memorial/app/updateMemorialInfo?mid="+that.mid+"&livemvdays="+that.data.livemvdays+"&livemv="+that.data.livemv+"&condolencespwd="+that.data.condolencespwd+"&condopay="+that.data.condopay+"&livemsg="+that.data.livemsg+"&epitaph="+that.data.epitaph+"&condolencesdate="+that.data.condolencesdate+"&memorialtype="+that.data.memorialtype+"&movicetype="+that.data.movicetype+"&condolencespwd="+that.data.condolencespwd+"&musicstatus="+that.data.musicstatus+"")
                        .then(function(res){

                            that.$toast('模拟支付成功')
                            that.$router.push('/')
                        },function(err){
                        }).catch(function(error){
                        });
                    },function(err){
                    }).catch(function(error){
                    });
      },
      remove (item) {
          var that = this
          this.$axios.get("/huainianwang/shoppingCart/app/delShoppingCart?sid="+item.id+"")
				.then(function(res){
					// alert(1)
					that.$toast('删除成功')
                    // that.$router.go(-1)
                    that.getCarList()
				},function(err){
				}).catch(function(error){
				});
      },
      getCarList () {
          let that = this
          this.$axios.get("/huainianwang/shoppingCart/app/getShoppingCartByMid?mid="+this.mid+"")
				.then(function(res){
          that.datas = res.data.object
          that.allprice = 0
          that.datas.forEach(element => {
            if (element.goodstatus === 0) that.allprice += element.goodprice
          })
				},function(err){
				}).catch(function(error){
				});
      }
   },
  computed: {
      ...mapState({
        guanInfo: state => state.account.guanInfo,
        userId: state => state.account.userId,
        mudiBg: state => state.mudiEdit.mudiBackgroundImage,
        dragItemLists: state => state.mudiEdit.mudiEditInfo,
        mudiMusic: state => state.mudiEdit.mudiMusic
      }),
      vantAllPrice() {
        return this.allprice * 100
      },

  }
}
</script>

<style scoped lang="scss">


</style>
<style>
.containers .van-button--large{
    position: static !important;
    background-color: #f44 !important;
    border: 1px solid #f44 !important;
    height: 45px !important;
    margin: 0 !important;
    width: 50% !important;
    line-height: 45px !important;
}
</style>

